<template>
  <div>
    <div v-if="isShow">默认显示</div>
    <div>{{obj.name}} -- {{obj.age}}</div>
    <div>{{age}}</div>
    <div>{{strType}}</div>
  </div>
</template>

<script>
export default {
  props: {
    // str 可以是数字或字符串
    str: [Number, String],
    // num 是必传参数
    num: {
      type: Number,
      required: true
    },
    // 默认值是false
    isShow: {
      type: Boolean,
      default: true
    },
    // 对象或数组默认值必须从一个工厂函数获取
    obj: {
      type: Object,
      default () {
        return {
          name: 'hi',
          age: 25
        }
      }
    },
    // 自定义验证函数
    // 父组件传递过来的值必须大于20, 否则报错
    age: {
      validator (value) {
        console.log(value)
        return value > 20
      }
    },
    // 父组件传递过来的值必须是success、warning、danger的其中一个
    strType: {
      validator (value) {
        return ['success', 'warning', 'danger'].indexOf(value) !== -1
      }
    }
  }
}
</script>

<style>

</style>
